<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"/>
    <title>电压监控分布</title>
    <link rel="stylesheet" type="text/css" href="../../leaflet/leaflet.css"/>
    <link rel="stylesheet" type="text/css" href="../../leaflet/leaflet.marker.highlight.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/map.css"/>
    <script src="../../leaflet/leaflet.js"></script>
    <script src="../../leaflet/leaflet.marker.highlight.js"></script>
    <link rel="stylesheet" type="text/css" href="../../leaflet/leaflet.marker.highlight.css"/>
</head>
<body>
<div id="map"></div>
<script src="../../js/mapSource.js"></script>
<script src="../../js/lib/jquery-3.2.1.min.js"></script>
<script src="../../js/layer.js"></script>
<script src="../../js/common.js"></script>
<script>

    layerManager.setMap(map);
    layerManager.setBaseLayer(BaseLayers.getMapBoxUrl(), BaseLayers.getLayerDetails(1).id, BaseLayers.getToken());
    var myRenderer = L.svg({ padding: 0.5 });
    var line = L.polyline( [[34.71385192871, 112.812599182129],
        [34.71385192871, 114.135353088379]], { renderer: myRenderer ,color:'red'} );





    line.on('click',function () {
        alert("点击了");
    });
    line.addTo(map);
    var circle = L.circle( [34.71385192871, 112.812599182129],{radius: 200}, { renderer: myRenderer} ).addTo(map);
    map.fitBounds([[34.71385192871, 112.812599182129],
        [34.9339599609375, 114.135353088379]]);

    var icon = "<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='10' height='10'><path stroke='red' stroke-width='2' fill='none' d='M 0,0 L 10,10 M 10,0 L 0,10 Z'/></svg>";
    var svgURL = "data:image/svg+xml;base64," + btoa(icon);
    var mySVGIcon = L.icon({ iconUrl: svgURL });
    L.marker([34.9339599609375, 114.135353088379], {icon: mySVGIcon}).addTo(map);



</script>
</body>
</html>